<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<!DOCTYPE html>
<html>
<head>
<title>管理平台</title>
<jsp:include page="../../include/header.jsp"></jsp:include>
<style type="text/css">
.chooseBtn {
	display: none;
}

.choose-label {
	box-shadow: #ccc 0px 0px 0px 1px;
	width: 40px;
	height: 20px;
	display: inline-block;
	border-radius: 20px;
	position: relative;
	background-color: #bdbdbd;
	overflow: hidden;
}

.choose-label:before {
	content: '';
	position: absolute;
	left: 0;
	width: 20px;
	height: 20px;
	display: inline-block;
	border-radius: 20px;
	background-color: #fff;
	z-index: 20;
	-webkit-transition: all 0.5s;
	transition: all 0.5s;
}

.chooseBtn:checked+label.choose-label:before {
	left: 20px;
}

.chooseBtn:checked+label.choose-label {
	background-color: #51ccee;
}
</style>



</head>
<body>
	<div id="wrapper" class="row">
		
				<div class="col-lg-12">
					<h1 class="page-header">秒杀时间段</h1>
					<div class="pull-right">
						<button type="button"
							onclick="javascript:window.location.reload()"
							class="btn btn-success pull-right btn-refresh margin-lr">
							<span class="fa fa-refresh fa-lg"></span>
						</button>
							<button type="button" class="btn btn-success pull-right margin-lr" onclick="toAdd()">
									<span class="fa fa-plus"></span> 添加
								</button>
					</div>

				</div>
				<div class="col-lg-12">
					<div class="col-lg-12">
						<!-- <div class="col-lg-6"> -->
						<div class="text-muted single-line-text pull-left">
							共 <font color="#428bca" id="dataCount">0</font> 条记录
							<!-- <h2>数据列表</h2> -->
						</div>

					</div>
					<div class="col-lg-12">
						<table id="dataTable" class="table table-striped table-hover">
							<thead>
								<tr>
									<th>编号</th>
									<th>秒杀时间段</th>
									<th>每日开始时间</th>
									<th>每日结束时间</th>
									<th>启用</th>
									<th>操作</th>
								</tr>
							</thead>
							<tbody id="dataList"></tbody>
						</table>
					</div>
						<div class="col-lg-12">
							<ul id="dataPagination" class="pagination-sm pull-right"></ul>
						</div>
					</div>
		
	</div>
	<jsp:include page="../../include/javascripts.jsp"></jsp:include>
	<!-- 异步加载下一页数据后，用模板渲染 -->
	<script type="text/html" id="dataTpl">
	{{each list as item}}
	<tr id="item{{item.id}}" data-id="{{item.id}}">
		<td>{{item.id}}</td>
		<td>{{item.time_line}}</td>
		<td>{{item.begin}}</td>
		<td>{{item.end}}</td>
		 <td>{{item.state | flagTransform:1,'启用',0,'禁用' }}</td>
		<td><button type="button" class="btn btn-sm btn-primary btn-simple" onclick="toEdit('{{item.id}}')" title="编辑"><span class="fa fa-edit fa-lg"></span></button> <button type="button" class="btn btn-sm btn-danger btn-simple" onclick="toDelete('{{item.id}}')" title="删除"><span class="fa fa-remove fa-lg"></span></button></td>
	</tr>
	{{/each}}
</script>
	<!-- <input type="checkbox" name="check" id="{{item.id}}" checked class="chooseBtn" onclick="return false;" /><label for="{{item.id}}" class="choose-label"></label>{{/if}}{{if item.state==0}}<input type="checkbox" name="check" id="{{item.id}}" class="chooseBtn" onclick="return false;" /><label for="{{item.id}}" class="choose-label"></label>{{/if}}</td> -->
	<!-- <td>{{item.state | flagTransform:1,'启用',0,'关闭' }}</td> -->

	<!-- <td>{{item.start }}</td>
		<td>{{item.stop }}</td>
		<td>{{item.publish | flagTransform:1,'已上架',0,'已下架' }}</td>	 -->


	<script type="text/javascript">
		var dataPaginator;
		$(function() {
			dataPaginator = Kit.pagination("#dataPagination",
					"${BASE_PATH}/spike/time/page", {
						"pageSize" : 10
					}, function(result) {
						//设置显示最新的数据数量
						$("#dataCount").html(result.object.totalRow);
						//根据模板渲染数据并填充
						$("#dataList").empty().append(
								template("dataTpl", result.object));
					});
		});
		var addDialog;
		function toAdd() {
			addDialog = Kit.dialog("添加", "${BASE_PATH}/spike/time/toAdd")
					.open();
		}
		var editDialog;
		function toEdit(id) {
			editDialog = Kit.dialog("编辑",
					"${BASE_PATH}/spike/time/toEdit/" + id).open();
		}
		function onEditSuccess(id, newObject) {
			$("#item" + id).replaceWith(template("list-tpl", {
				"list" : [ newObject ]
			}));
		}

		function toDelete(id) {
			Kit.confirm("提示", "您确定要删除这条数据吗？", function() {
				$.post("${BASE_PATH}/spike/time/doDelete/" + id, function(
						data) {
					switch (data.flag) {
					case -1:
						Kit.alert("网络繁忙...");
						return;
					case 1:
						Kit.alert("当前有活动使用这个时间段，无法删除");
						return;
					case 0:

						$("#item" + id).remove();
					}

				});
			});
		} 

		/* function toDelete(id) {
			Kit.confirm("提示", "您确定要删除这条数据吗？", function() {
				$.post("${BASE_PATH}/spike/time/doDelete/" + id, function(
						result) {

					$("#item" + id).remove();
				});
			});
		}  */
		function doSort() {
			$("#sortForm").ajaxSubmit({
				success : function(data) {
					switch (data.flag) {
					case -1:
						Kit.alert("网络繁忙...，请重试");
						return;
					case 0:
						window.location.reload();
					}
				}
			});
		}
	</script>
</body>
</html>